﻿<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<fmt:setBundle basename="ApplicationMessage" />

<!DOCTYPE html>
<html lang="zh-CN">
<head>

  <%@ include file="/WEB-INF/include/meta.jsp"%>
  <%@ include file="/WEB-INF/include/css.jsp"%>

</head>

<body class="ihg-theme-draft">


  <%@ include file="/WEB-INF/include/header.jsp"%>
  <jsp:include page="/WEB-INF/include/submenu-session.jsp">
    <jsp:param name="currentUrl" value="${ctx.host}/sessions/${id}" />
  </jsp:include>

  <div class="container-fluid ihg-container has-ihg-sidemenu">
    <div class="ihg-breadcrumb">
      <ol class="breadcrumb border-breadcrumb">
        <li class="active"><fmt:message key="assessor.416" /></li>
      </ol>
      <div class="pull-right">
        <c:set var="urlParam" value="subgroup=${subgroup}"/>
        <a href="${ctx.host}/sessions/${id}/peer-calibrations?${not empty subgroup ? urlParam : ''}" style="color: #155CB2; font-size: 16px;"><<&nbsp;<fmt:message key="assessor.376" /></a>
      </div>
    </div>

    <div class="ihg-content-layout has-operation">
      <ul class="list-unstyled instruction-list">
        <li><fmt:message key="assessor.417" /><a href="#example-modal" data-target="#example-modal" data-toggle="modal"><fmt:message key="assessor.418" /></a>
        </li>
        <li><fmt:message key="assessor.419" /></li>
      </ul>
      <div class="row">
        <div class="col-xs-10">
          <div class="messages hide">
            <c:forEach var="strongAnchorScore" items="${strongAnchorScores}">
              <div class="strong" data-com="${strongAnchorScore.key}" data-effective="${competency[strongAnchorScore.key].effective}" data-ineffective="${competency[strongAnchorScore.key].inEffective}">
                <c:forEach var="scoreMapper" items="${strongAnchorScore.value}">
                  <div class="anchor">
                    <input type="hidden" name="name" value='<fmt:message key="${scoreMapper.name}"></fmt:message>'>
                    <input type="hidden" name="sDesc" value='<fmt:message key="${scoreMapper.sDesc}"></fmt:message>'>
                    <input type="hidden" name="cDesc" value='<fmt:message key="${scoreMapper.cDesc}"></fmt:message>'>
                    <input type="hidden" name="dnDesc" value='<fmt:message key="${scoreMapper.dnDesc}"></fmt:message>'>
                    <input type="hidden" name="score" value='${scoreMapper.score}'>
                  </div>
                </c:forEach>
              </div>
            </c:forEach>
            <c:forEach var="weakAnchorScore" items="${weakAnchorScores}">
              <div class="weak" data-com="${weakAnchorScore.key}" data-effective="${competency[weakAnchorScore.key].effective}" data-inEffective="${competency[weakAnchorScore.key].inEffective}">
                <c:forEach var="scoreMapper" items="${weakAnchorScore.value}">
                  <div class="anchor">
                    <input type="hidden" name="name" value='<fmt:message key="${scoreMapper.name}"></fmt:message>'>
                    <input type="hidden" name="sDesc" value='<fmt:message key="${scoreMapper.sDesc}"></fmt:message>'>
                    <input type="hidden" name="cDesc" value='<fmt:message key="${scoreMapper.cDesc}"></fmt:message>'>
                    <input type="hidden" name="dnDesc" value='<fmt:message key="${scoreMapper.dnDesc}"></fmt:message>'>
                    <input type="hidden" name="score" value='${scoreMapper.score}'>
                  </div>
                </c:forEach>
              </div>
            </c:forEach>
          </div>
          
          <form class="form-horizontal" method="POST" action="${ctx.host}/sessions/${sessionCalibration.session.id}/peer-calibrations/${sessionCalibration.id}/overall-advantage-disadvantage-choose" data-validate="true" data-redirect="${ctx.host}/sessions/${sessionCalibration.session.id}/peer-calibrations/${sessionCalibration.id}/overall-advantage-disadvantage-submit?subgroup=${subgroup}" data-type="choose">
            <input type="hidden" name="_method" value="PATCH">
            <input type="hidden" name="id" value="${comment.id}">
            
            <div class="competency-summary" style="overflow-y: scroll; margin-top: 30px;">
              <div class="form-group ihg-form-group">
                <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.420" /></label>
                <div class="col-xs-4">
                  <select name="strengthOne" class="form-control select2" data-validate="required" data-placeholder="<fmt:message key="assessor.421" />">
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${comment.strengthOne eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" />${type.other ? '' : '-'}${competency[type.description].score}</option>
                    </c:forEach>
                  </select>
                  <input type="text" name="strengthOneTitle" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control ${comment.strengthOneTitle != null ? '' : 'hide'}" data-placeholder=" <fmt:message key="assessor.466" />" value="${comment.strengthOneTitle}"/>
                  <%-- <c:if test="${not empty comment.strengthOneOther}">
                    <input type="text" name="strengthOneOther" data-validate="required" data-type="strength" style="margin-top: 10px;" class="selecte2 form-control" placeholder="<fmt:message key="assessor.467" />" value="${comment.strengthOneOther}">
                  </c:if> --%>
                  <textarea class="form-control scorllbar-textarea" data-validate="required" name="strengthOneComment" data-type="strength" <%-- placeholder="<fmt:message key="assessor.422" /> --%>>${comment.strengthOneComment}</textarea>
                </div>
                <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.427" /></label>
                <div class="col-xs-4">
                  <select name="dnOne" class="form-control select2" data-validate="required" data-placeholder="<fmt:message key="assessor.421" />">
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${comment.dnOne eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" />${type.other ? '' : '-'}${competency[type.description].score}</option>
                    </c:forEach>
                  </select>
                  <input type="text" name="dnOneTitle" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control ${comment.dnOneTitle != null ? '' : 'hide'}" data-placeholder=" <fmt:message key="assessor.466" />" value="${comment.dnOneTitle}" />
                  <%-- <c:if test="${not empty comment.dnOneOther}">
                    <input type="text" name="dnOneOther" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control" placeholder="<fmt:message key="assessor.467" />" value="${comment.dnOneOther}">
                  </c:if> --%>
                  <textarea class="form-control scorllbar-textarea" data-validate="required" name="dnOneComment" <%-- placeholder="<fmt:message key="assessor.422" /> --%> ">${comment.dnOneComment}</textarea>
                </div>
              </div>
              <div class="form-group ihg-form-group">
                <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.425" /></label>
                <div class="col-xs-4">
                  <select name="strengthTwo" class="form-control select2" data-validate="required" data-placeholder="<fmt:message key="assessor.421" />">
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${comment.strengthTwo eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" />${type.other ? '' : '-'}${competency[type.description].score}</option>
                    </c:forEach>
                  </select>
                  <input type="text" name="strengthTwoTitle" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control ${comment.strengthTwoTitle != null ? '' : 'hide'}" data-placeholder=" <fmt:message key="assessor.466" />" value="${comment.strengthTwoTitle}"  />
                  <%-- <c:if test="${not empty comment.strengthTwoOther}">
                    <input type="text" name="strengthTwoOther" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control" placeholder="<fmt:message key="assessor.467" />" value="${comment.strengthTwoOther}" >
                  </c:if> --%>
                  <textarea class="form-control scorllbar-textarea" data-validate="required" name="strengthTwoComment" <%-- placeholder="<fmt:message key="assessor.422" /> --%> " >${comment.strengthTwoComment}</textarea>
                </div>
                <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.428" /></label>
                <div class="col-xs-4">
                  <select name="dnTwo" class="form-control select2" data-validate="required" data-placeholder="<fmt:message key="assessor.421" />" >
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${comment.dnTwo eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" />${type.other ? '' : '-'}${competency[type.description].score}</option>
                    </c:forEach>
                  </select>
                  <input type="text" name="dnTwoTitle" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control ${comment.dnTwoTitle != null ? '' : 'hide'}" data-placeholder=" <fmt:message key="assessor.466" />" value="${comment.dnTwoTitle}"  />
                  <%-- <c:if test="${not empty comment.dnTwoOther}">
                    <input type="text" name="dnTwoOther" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control" placeholder="<fmt:message key="assessor.467" />" value="${comment.dnTwoOther}">
                  </c:if> --%>
                  <textarea class="form-control scorllbar-textarea" data-validate="required" name="dnTwoComment" <%-- placeholder="<fmt:message key="assessor.422" /> --%> ">${comment.dnTwoComment}</textarea>
                </div>
              </div>
              <div class="form-group ihg-form-group">
                <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.426" /></label>
                <div class="col-xs-4">
                  <select name="strengthThree" class="form-control select2" data-validate="required" data-placeholder="<fmt:message key="assessor.421" />">
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${comment.strengthThree eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" />${type.other ? '' : '-'}${competency[type.description].score}</option>
                    </c:forEach>
                  </select>
                  <input type="text" name="strengthThreeTitle" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control ${comment.strengthThreeTitle != null ? '' : 'hide'}" data-placeholder="<fmt:message key="assessor.466" />" value="${comment.strengthThreeTitle}"/>
                  <%-- <c:if test="${not empty comment.strengthThreeOther}">
                    <input type="text" name="strengthThreeOther" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control" placeholder="<fmt:message key="assessor.467" />" value="${comment.strengthThreeOther}">
                  </c:if> --%>
                  <textarea class="form-control scorllbar-textarea" data-validate="required" name="strengthThreeComment" <%-- placeholder="<fmt:message key="assessor.422" /> --%> ">${comment.strengthThreeComment}</textarea>
                </div>
                <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.429" /></label>
                <div class="col-xs-4">
                  <select name="dnThree" class="form-control select2" data-validate="required" data-placeholder="<fmt:message key="assessor.421" />">
                    <option value=""></option>
                    <c:forEach var="type" items="${enums['SessionCompetencyType']}">
                      <option value="${type}" ${comment.dnThree eq type ? 'selected' : ''} data-name="${type.description}"><fmt:message key="${type.message}" />${type.other ? '' : '-'}${competency[type.description].score}</option>
                    </c:forEach>
                  </select>
                  <input type="text" name="dnThreeTitle" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control ${comment.dnThreeTitle != null ? '' : 'hide'}" data-placeholder=" <fmt:message key="assessor.466" />" value="${comment.dnThreeTitle}"/>
                  <%-- <c:if test="${not empty comment.dnThreeOther}">
                    <input type="text" name="dnThreeOther" data-validate="required" style="margin-top: 10px;" class="selecte2 form-control" placeholder="<fmt:message key="assessor.467" />" value="${comment.dnThreeOther}">
                  </c:if> --%>
                  <textarea class="form-control scorllbar-textarea" data-validate="required" name="dnThreeComment" <%-- placeholder="<fmt:message key="assessor.422" /> --%> ">${comment.dnThreeComment}</textarea>
                </div>
              </div>
            </div>
            <div class="text-right" style="margin-right: 30px;">
              <button type="submit" class="btn btn-success"><fmt:message key="assessor.407" /></button>
            </div>
          </form>
        </div>
        
        <div class="col-xs-2">
          <div style="margin: 0 auto; width: 100px; height: 100px; border-radius: 100%; border: 1px solid #D88362; background: #F4F2ED;">
            <img src="${sessionCalibration.delegate.avatar}" style="border-radius: 100%; width: 100%">
          </div>
          <p class="text-center" style="margin-top: 10px; font-size: 16px; color: #888888;">${sessionCalibration.delegate.name}</p>
        <a href="${ctx.host}/sessions/${sessionCalibration.session.id}/peer-calibrations/${sessionCalibration.id}/overall-advantage-disadvantage" class="btn btn-success" style="margin-top: 30px;" data-toggle="modal" data-target="">观察与发展建议</a>
      </div>
      </div>

    </div>
  </div>
  
  <div class="modal fade validate-modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document" style="position: absolute; top: 50%; left: 50%; margin-top: -150px; margin-left:-250px; width: 500px; height: 200px;">
      <div class="modal-content">
        <div class="modal-body" style="height: 150px;">
          <p style="font-size: 18px; text-align: center; line-height: 125px; color: #c00000;">请完善内容</p>
        </div>
      </div>
    </div>
  </div>
  
  <div id="example-modal" class="modal fade example-modal" tabindex="-1" role="dialog">
    <div class="modal-dialog" role="document" style="position: absolute; top: 50%; left: 50%; margin-top: -150px; margin-left:-250px; width: 800px; height: 350px;">
      <div class="modal-content">
        <div class="modal-body form-horizontal" style="height: 300px;">
          <div class="form-group ihg-form-group">
            <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.420" /></label>
            <div class="col-xs-4">
              <textarea style="max-height: 250px;" class="form-control scorllbar-textarea" name="strengthOneComment" data-type="strength" disabled><fmt:message key="assessor.strength.example" /></textarea>
            </div>
            <label for="" class="col-xs-2 control-label" style="padding-left: 0px; padding-right: 0px;"><fmt:message key="assessor.427" /></label>
            <div class="col-xs-4">
              <textarea style="max-height: 250px;" class="form-control scorllbar-textarea" name="dnOneComment" disabled><fmt:message key="assessor.dn.example" /></textarea>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
  
  <%@ include file="/WEB-INF/include/footer.jsp"%>
  <%@ include file="/WEB-INF/include/script.jsp"%>
  <d:resource root="${ctx.resource}/build" type="script" src="js/page/session/during/peer-calibration/assessor/peer-calibration-submit.js" />
  <script type="text/javascript">
    require([ 'page/session/during/peer-calibration/assessor/peer-calibration-submit' ], function(page) {
      page.init();
    })
  </script>

</body>
</html>
